<!-- 局内便函公文详情-->
<template>
  <view>
    <van-collapse v-model="tableShow" accordion :border="border"
                  style="word-break: break-word !important;">
      <van-collapse-item title="基本信息" title-class="text-bold" name="jbxx">
        <template #title>
          <view :class="tableShow == 'jbxx' ? 'text-blue':''">
            <i class="van-icon van-icon-label-o van-cell__left-icon"></i>
            <span class="van-cell__title text-bold">
            基本信息
          </span>
          </view>
        </template>
        <van-cell-group :border="border" v-if="detailObj1.detailObj != null">
          <van-row class="content-border">
            <van-col span="8" class="content-title">文件标题</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.title }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">紧急程度</van-col>
            <van-col span="16" class="content-value content-red"
                     v-if="this.util.isNotEmpty(detailObj1.detailObj.emergencyLevel) && detailObj1.detailObj.emergencyLevel != '1'">
              <i class="iconfont icon-dian"></i>{{ this.dict.getDictNameByDictCode('swjjcd', detailObj1.detailObj.emergencyLevel) }}
            </van-col>
            <van-col span="16" class="content-value" v-else>
              {{ this.dict.getDictNameByDictCode('swjjcd', detailObj1.detailObj.emergencyLevel) }}
            </van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">收文时间</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.swTime }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">办结时限</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.limitDate }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">来文单位</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.fwDeptName }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">来文编号</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.fwCode }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">收文编号</van-col>
            <van-col span="16" v-if="detailObj1.detailObj.swYear != null && detailObj1.detailObj.swYear != ''"
                     class="content-value">
              {{ detailObj1.detailObj.swWord }}（{{ detailObj1.detailObj.swYear }}）{{ detailObj1.detailObj.swNum }}号
            </van-col>
            <van-col span="16" v-else class="content-value">{{ detailObj1.detailObj.swWord }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">主办处室</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.directDeptNames }}</van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">协办处室</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.coDeptNames }}</van-col>
          </van-row>

          <van-row class="content-border">
            <van-col span="8" class="content-title">已分办部门</van-col>
            <van-col span="16" class="content-value">
              <text v-for="(item,index) in otherDetail.fbDeptList" @click="openDetail(item.deptId,'FB')"
                    class="text-blue">
                {{
                  index == otherDetail.fbDeptList.length - 1 && item.deptName || (item.deptName != '' ? item.deptName + '、' : '')
                }}
              </text>
            </van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">传阅情况</van-col>
            <van-col span="16" class="content-value">
              <text class="margin-left-sm text-blue" @click="toCirculate">{{ chuanYueNameList }}</text>
            </van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">已发送</van-col>
            <van-col span="16" class="content-value">
              <text v-for="(item,index) in otherDetail.fsDeptList" class="margin-left-sm text-blue" @click="openDetail(item.acceptId)">
                {{
                  index == otherDetail.fsDeptList.length - 1 && item.acceptName || (item.acceptName != '' ? item.acceptName + '、' : '')
                }}
              </text>
            </van-col>
          </van-row>
          <van-row class="content-border">
            <van-col span="8" class="content-title">备注</van-col>
            <van-col span="16" class="content-value">{{ detailObj1.detailObj.remark }}</van-col>
          </van-row>
        </van-cell-group>
      </van-collapse-item>
      <van-collapse-item title="正文及附件" title-class="text-bold" name="zwjfj">
        <template #title>
          <view :class="tableShow == 'zwjfj' ? 'content-blue':''">
            <i class="van-icon van-icon-font-o van-cell__left-icon"></i>
            <span class="van-cell__title text-bold">
              正文及附件
            </span>
          </view>
        </template>
        <!-- TODO 正文需要插件显示 -->
        <view class="opinion" v-if="detailObj1.detailBody !=null">
          <text class="opinion-left">正文</text>
          <view class="opinion-right">
            <view v-for="item in detailObj1.detailBody" @click="lx.openFile(item,detailObj1.detailObj.extendIdForRelate)">
              <text class="text-blue">{{ item.attachName }}</text>
            </view>
          </view>
        </view>
        <view class="opinion" v-if="detailObj1.detailAttachment != undefined &&detailObj1.detailAttachment.length>0 ">
          <text class="opinion-left">附件</text>
          <view class="opinion-right">
            <view v-for="(item,index) in detailObj1.detailAttachment" @click="lx.openFile(item,detailObj1.detailObj.extendIdForRelate)">
              <text class="text-blue">{{ item.attachName }}</text>
            </view>
          </view>
        </view>
        <view class="opinion" v-if="detailObj1.relation != undefined &&detailObj1.relation.length>0 ">
          <text class="opinion-left">附加公文</text>
          <view class="opinion-right">
            <view v-for="(item,index) in detailObj1.relation" @click="lx.openFile(item,detailObj1.detailObj.extendIdForRelate)">
              <text class="text-blue">{{ item.title }}</text>
            </view>
          </view>
        </view>

      </van-collapse-item>
      <van-collapse-item title="意见" title-class="text-bold" name="yj">
        <template #title>
          <view :class="tableShow == 'yj' ? 'content-blue':''">
            <i class="van-icon van-icon-comment-o van-cell__left-icon"></i>
            <span class="van-cell__title text-bold">
              意见
            </span>
          </view>
        </template>
        <view v-if="detailObj1.opinion != null">
          <template v-for="(itemOpinion,index) in reviewType">
            <view class="opinion" v-if="detailObj1.opinion[itemOpinion.dictItemCode] != undefined">
              <view class="opinion-title">{{ itemOpinion.dictItemName }}</view>
              <view class="opinion-box padding-left-sm"
                    v-for="(item,index) in detailObj1.opinion[itemOpinion.dictItemCode]" :key="index">
                <!--如果和上一项意见的部门相同，则隐藏部门-->
                <view class="opinion-left text-bold"
                      v-if="!(index>0 && detailObj1.opinion[itemOpinion.dictItemCode][index-1].parentDeptCode == item.parentDeptCode)">
                  {{ item.parentDeptName }}
                </view>
                <view class="opinion-left">{{ item.opinion }}</view>
                <view class="opinion-left">{{ item.attachName }}</view>
                <view class="opinion-right">
                  <!-- base64签名图片 -->
                  <img v-if="item.signature!='' && item.signature != undefined"
                       :src="`data:image/png;base64,`+item.signature" alt="图片未上传"/>
                  <text v-else class="opinion-user">{{ item.userName }}</text>
                  <text class="opinion-date">{{ item.approvalTime }}</text>
                </view>
              </view>
            </view>
          </template>
        </view>
      </van-collapse-item>
      <!--公文分发功能-->
      <van-collapse-item v-if="showFenfaBtn" title="公文分发信息" title-class="text-bold" name="gwffxx">
        <template #title>
          <view :class="tableShow == 'gwffxx' ? 'content-blue':''">
            <i class="van-icon van-icon-share-o van-cell__left-icon"></i>
            <span class="van-cell__title text-bold">
                  公文分发信息
                </span>
          </view>
        </template>
        <van-row class="content-border">
          <van-col span="8" class="content-title">请选择分发人</van-col>
          <van-col span="16" class="content-value">
            <van-cell style="padding:0 !important;color: #969799" title="" :value="fenfaUserName" is-link
                      @click="showFenfa"/>
          </van-col>
        </van-row>
        <van-row class="content-border">
          <van-field style="min-width: 30% !important;" v-model="distributeInfo" center clearable rows="2" autosize
                     label="" type="textarea" placeholder="分发意见">
            <template #button>
              <van-button style="padding: 0 30rpx;!important;" size="mini" type="info" :disabled="!fenfaUserName"
                          @click="ditributetouser">分发
              </van-button>
              <van-button v-if="showYiyueBtn" style="padding: 0 26rpx;!important;" size="mini" type="info"
                          @click="updateDistributeStatus">已阅
              </van-button>
            </template>
          </van-field>
        </van-row>
        <view class="opinion">
          <view class="opinion-title">公文分发信息:</view>
          <view class="opinion-box padding-bottom" v-for="item in distributeProcess">
            <view class="opinion-left">分发过程:{{ item.distributeUserName }}--->{{
                item.receiveUserName
              }}({{ item.status == '0' ? '未阅' : '已阅:' + item.handleTime }})
            </view>
            <view class="opinion-left" v-if="item.distributeInfo">{{ item.distributeInfo }}</view>
            <view class="opinion-right">
              <text class="opinion-date">{{ item.distributeUserName }}</text>
              <text class="opinion-date">{{ item.distributeTime }}</text>
            </view>
          </view>
        </view>
      </van-collapse-item>
    </van-collapse>
  </view>
</template>

<script>
export default {
  props: {
    detailObj1: {
      detailObj: Object,
      detailBody: Object,
      detailAttachment: Object,//附件
      opinion: Object,//意见
    },
    //列表返回的proInstId
    proInstId: {
      type: String,
      default: ''
    },
    otherDetail: {
      fbDeptList: {//分办处室
        type: Array,
        default: () => []
      },
      chuanYueList: {//传阅情况
        type: Array,
        default: () => []
      }
    }

  },
  data() {
    return {
      border: false,
      tableShow: "jbxx",
      message: '',
      reviewType: [],//意见类型
      proInstIdOld:'',
      showFenfaBtn:false,//是否显示分发功能
      distributeInfo:'',//分发信息
      fenfaUserName:'',//选中的要分发的用户名，多个用顿号分割
      fenfaUserId:'',//选中的要分发的用户id，多个用逗号分割
      distributeProcess:[],//已分发的信息列表
      showYiyueBtn:false,//是否显示已阅按钮
    };
  },
  watch: {
    detailObj1: {
      handler(nVal, oVal) {
        if (this.util.isNotEmpty(nVal.detailObj)) {
          if (this.util.isNotEmpty(nVal.detailObj.proInstId)) {
            if(this.proInstIdOld != nVal.detailObj.proInstId){
              this.proInstIdOld = nVal.detailObj.proInstId
              this.isProcessClosed(this.proInstIdOld)
            }
          }
        }
      },
      immediate: true,
      deep: true
    },
  },
  mounted() {
    this.reviewType = this.cache.get('reviewType')
  },
  computed: {
    chuanYueNameList() {
      return this.otherDetail.chuanYueList.map(item => item.receiverDeptName).join('、')
    }
  },
  methods: {
    //判断是否显示分发功能
    showFenfa() {
      this.$emit('showFenfaSheet')
    },
    //父组件调用，传选中的用户对象给子组件
    initParam(userInfo){
      this.fenfaUserName = userInfo.userName.join('、')
      this.fenfaUserId = userInfo.userId.join(',')
    },
    //判断是否显示分发功能-判断流程是否结束，如果结束显示分发功能
    isProcessClosed(proInstId) {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/distributedoc/doc/isProcessClosed`),
        method: 'get',
        params: {
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'proInstId':proInstId
        }
      }).then(({data}) => {
        //返回true 则说明流程已结束，显示分送按钮{"code":200,"data":true,"message":null}
        if (data.code == 200) {
          this.showFenfaBtn = data.data
          //如果true，再调用获取公文分发信息接口
          this.getDistributeProcess(proInstId)
        }
      })
    },
    //已阅按钮是否显示
    isShowYiyueBtn(proInstId){
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/distributedoc/doc/getDistribute`),
        method: 'get',
        params: {
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'proInstId':proInstId
        }
      }).then(({data}) => {
        if (data.code == 200) {
          if(data.data.info.length>0){
            this.showYiyueBtn = true
          }else{
            this.showYiyueBtn = false
          }
        }
      })
    },
    //已阅
    updateDistributeStatus(){
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/distributedoc/doc/updateDistributeStatus`),
        method: 'get',
        params: {
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'proInstId': this.proInstIdOld
        }
      }).then(({data}) => {
        if (data.code == 200) {
          this.$toast('操作成功')
          this.isShowYiyueBtn(this.proInstIdOld)
          this.getDistributeProcess(this.proInstIdOld)
        }else{
          this.$toast('已阅操作失败，错误码：'+data.code)
        }
      })
    },
    //获取已分发信息
    getDistributeProcess(proInstId) {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/distributedoc/doc/getDistributeProcess`),
        method: 'get',
        params: {
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'proInstId':proInstId
        }
      }).then(({data}) => {
        if (data.code == 200) {
          this.distributeProcess = data.data.process
        }else{
          this.$toast('获取公文分发信息失败，错误码：'+data.code)
        }
      })
    },
    //分发给分发人
    ditributetouser(){
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/distributedoc/doc/ditributetouser`),
        method: 'get',
        params: {
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'ids':this.fenfaUserId,
          'docType':this.detailObj1.detailObj.bizType,//文件类型
          'proInstId':this.proInstIdOld,
          'docId':this.detailObj1.detailObj.swId,//文件id
          'title':this.detailObj1.detailObj.title,
          'distributeInfo':this.distributeInfo
        }
      }).then(({data}) => {
        if (data.code == 200) {
          this.$toast('分发成功')
          this.getDistributeProcess(this.proInstIdOld)
          this.distributeInfo=''
          this.fenfaUserId=''
          this.fenfaUserName=''
        }else{
          this.$toast('分发出错了，错误码：'+data.code)
        }
      })
    },
    //传阅详情查看
    toCirculate() {
      this.$emit('showCirculate', true)
    },
    /**
     * 打开详情，不带操作按钮
     * @param deptId
     * @param type MAIN-主送，COPY-抄送，FB-分办
     */
    openDetail(deptId, type) {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/component/approval/getProInstId`),
        method: 'get',
        params: this.$http.adornParams({
          'systemKey': this.cache.get('userInfo').systemKey,//固定值
          'systemFlag': this.cache.get('userInfo').systemFlag,//固定值
          'proInstId': this.proInstId,
          'deptId': deptId,
          'type': type
        })
      }).then(({data}) => {
        //data.data 为null 则说明当前没有意见
        //{code: 200, data: '5bc2668c986d4403a98c852fc9d3a73c', message: null}
        if (data.code == 200) {
          if (this.util.isNotEmpty(data.data)) {
            //如果当前的proInstId 等于data.data ，则说明就是当前文自己
            if (this.proInstId != data.data) {
              //跳转收文详情页面查看意见
              this.toDetail(data.data)
            }
          } else {
            this.$toast('未查询到部门办理意见')
          }
        }
      })
    },
    //跳转详情code:发文类型，proInstId
    toDetail(proInstId) {
      // 会签件--hqj，发文（函）--glj_fw，呈批件--glj_cpj，发电--fd_hbglj，发电抄阅--hbgljfd，收文--glj_sw
      const _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/comm/comm/openwfneededdata`),
        method: 'get',
        params: this.$http.adornParams({
          'proInstId': proInstId,//发文详情返回的proInstId
          'systemKey': this.cache.get('userInfo').systemKey,//固定值
          'systemFlag': this.cache.get('userInfo').systemFlag,//固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          _this.configCode = data.data.configCode
          console.log("公文类型==>" + _this.configCode)
          if (_this.configCode != '') {
            this.common.toCaac(_this.configCode, proInstId, 'search')
          }
        } else {
          this.$toast(data.message)
        }
      })
    },


  },
};
</script>

<style scoped>

/* 意见相关样式 */
.opinion{
  display: flex;
  flex-direction: column;
  margin: 0 32rpx;
  padding: 20rpx 0rpx;
  overflow: hidden;
  font-size: 28rpx;
  line-height: 24px;
  border-bottom: 1px solid #ebedf0;

}
.opinion .opinion-title{
  text-align: left;
  padding-bottom: 14rpx;
}
.opinion .opinion-box{
  margin-bottom: 20rpx;
}
.opinion .opinion-left{
  text-align: left;
  color: #323233;
}
.opinion .opinion-right{
  text-align: right;
  color: #969799;
}
.opinion .opinion-right .opinion-user{
  font-weight: 400;
  color: #000000;
}
.opinion .opinion-right .opinion-date{
  color: #323233;
  margin-left: 20rpx;
}

.van-cell__title {
  min-width: 50%;

span {
  display: inline-block;
  text-align: left;
  word-break: break-all;
}
}

/deep/ .van-collapse-item__content {
  padding: 0px;
  color: #969799;
  font-size: 14px;
  line-height: 1.5;
  background-color: #fff
}

/deep/ .content-border {
  border-bottom: 1rpx solid #e4e4e4;
  display: flex;
}
.content-title {
  background-color: #f2f2f2;
  padding: 10px 15px;
  color: #646566;
  display: flex;
  align-items: center;
}
.content-value {
  padding: 10px 15px;
  text-align: right;
}
.content-red {
  color: #ed1c24;
}
.content-blue {
  color: #0081ff;
}
</style>
